import { defaultSetting } from "@/default-setting";
import { useGlobalStore } from "@/stores/global";

import HeaderTitle from "./header-title";

function Header() {
    // const { darkMode, collapsed, setCollapsed, setDarkMode, setLang, lang } = useGlobalStore;
    const { collapsed, setCollapsed } = useGlobalStore();

    return (
        <div
            style={{ zIndex: 998, height: defaultSetting.headerHeight }}
            className="flex basis-[48px] items-center px-0 gap-[16px] fixed top-0 right-0 left-0 bg-[var(--ant-color-bg-layout)]"
        >
            <HeaderTitle
                collapsed={collapsed}
                setCollapsed={setCollapsed}
            />
            <div className="flex items-center justify-between max-md:justify-end flex-1 pr-[24px]">
                {/* <ThemeSwitcher darkMode={darkMode} setDarkMode={setDarkMode} />
              <LangDropdown lang={lang} setLang={setLang} />
              <UserInfo darkMode={darkMode} /> */}
            </div>
        </div>
    );
}

export default Header;
